<template>
    <el-card>

        <!-- 动态按钮 -->
        <el-button type="default" size="default" v-for="item in buttonList" :key="item.PId"
            @click="dynamicButtonClick(item.PId)">{{
            item.PName
        }}</el-button>
        <!-- 查询条件 -->
        <el-form :model="condition" label-width="100px" :inline="true" size="normal" style="float:right">
            <el-form-item>
                <el-input v-model="condition.pName" placeholder="请输入要查询的权限名称"></el-input>
            </el-form-item>
            <el-form-item>
                <el-button type="primary" @click="handleCurrentChange(1)">查询</el-button>

            </el-form-item>
        </el-form>

    </el-card>
    <el-card>
        <el-table :data="permissionList" border stripe>
            <el-table-column type="selection" align='center'>
            </el-table-column>

            <el-table-column label="权限编号" prop="PId" align='center'>
            </el-table-column>
            <el-table-column label="权限名称" prop="PName" align='center'>
            </el-table-column>
            <el-table-column label="路由" prop="Path" align='center' width="280">
            </el-table-column>
            <el-table-column label="图标" prop="Icon" align='center'>
            </el-table-column>
            <el-table-column label="父级编号" prop="ParentId" align='center'>
            </el-table-column>
            <el-table-column label="操作" align='center'>
                <template #default="scope">
                    <el-link style="margin-right:10px" type="warning">编辑</el-link>
                    <el-link type="danger">删除</el-link>
                </template>
            </el-table-column>

        </el-table>

        <!-- 列表显示 -->
    </el-card>
    <el-card>
        <!-- 分页 -->
        <table style="margin: 5px auto;">
            <tbody>
                <tr>
                    <td><el-pagination v-model:current-page="pager.pageIndex" v-model:page-size="pager.pageSize"
                            :page-sizes="[1, 2, 3, 10]" layout="total, slot,sizes" :total="pager.totalCount"
                            @size-change="handleSizeChange" @current-change="handleCurrentChange" prev-text="上一页"
                            next-text="下一页">
                            <span class="el-pagination__total is-first">&nbsp;共计{{ pager.pageCount }}页,当前{{
            pager.pageIndex
        }}/{{ pager.pageCount }}页</span>
                        </el-pagination>
                    </td>
                    <td><el-pagination v-model:current-page="pager.pageIndex" v-model:page-size="pager.pageSize"
                            :page-sizes="[1, 2, 3, 10]" layout="slot, prev, pager" :total="pager.totalCount"
                            @size-change="handleSizeChange" @current-change="handleCurrentChange" prev-text="上一页"
                            next-text="下一页">
                            <button @click="handleCurrentChange(1)" :disabled="pager.pageIndex == 1"
                                class="btn-prev">首页</button>
                        </el-pagination></td>
                    <td><el-pagination v-model:current-page="pager.pageIndex" v-model:page-size="pager.pageSize"
                            :page-sizes="[1, 2, 3, 10]" layout="slot, next, jumper" :total="pager.totalCount"
                            @size-change="handleSizeChange" @current-change="handleCurrentChange" prev-text="上一页"
                            next-text="下一页">
                            <button @click="handleCurrentChange(pager.pageCount)"
                                :disabled="pager.pageIndex == pager.pageCount" class="next-prev">尾页</button>
                        </el-pagination></td>
                </tr>
            </tbody>
        </table>
    </el-card>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted } from 'vue'
import axios from 'axios'
import { baseURL_dev } from '@/config/baseURL'

const baseURL = baseURL_dev
axios.defaults.baseURL = baseURL


import { loginStore } from "@/stores/login"
import { useRoute } from 'vue-router'
const Route = useRoute();
const store = loginStore();

const condition = reactive({
    pName: "",


})
function handleSizeChange(size) {
    pager.pageSize = size;
    getPermissionList();
}
function handleCurrentChange(index) {
    pager.pageIndex = index;
    getPermissionList();
}
const pager = reactive({
    pageSize: 10,
    pageIndex: 1,
    pageCount: 0,
    totalCount: 0,
})

const permissionList = ref([])
//获取权限列表
function getPermissionList() {
    axios.get("Permission/GetCondtionPagingPermissionList", {
        params: {
            pName: condition.pName,
            pageSize: pager.pageSize,
            pageIndex: pager.pageIndex
        }
    }).then(res => {
        console.log(res.data);
        permissionList.value = res.data.Data;
        pager.pageCount = res.data.PageCount;
        pager.totalCount = res.data.TotalCount;
    })
}
const buttonList = ref([])
//根据路径获取按钮权限
function getButtonPermissionsByPath() {
    let empId = '';
    if (store.getUserInfo().IsTenant) {
        empId = store.getUserInfo().TenantId + 'admin'
    }
    else {
        empId = store.getUserInfo().UId
    }
    axios.get("Permission/GetButtonPermissionsByPath", {
        params: {
            empId: empId,
            path: Route.fullPath
        }
    }).then(res => {
        buttonList.value = res.data.Data;
    })
}
function dynamicButtonClick(pid: string) {
    switch (pid) {
        //权限添加
        case "M3004001": permissionAdd(); break;


    }
}
function permissionAdd() {

}
onMounted(() => {
    getButtonPermissionsByPath();
    getPermissionList()
})
</script>

<style scoped></style>